<include file="public/min-header"/>
<div class="wrapper">
  <include file="public/breadcrumb"/>
  <!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title"><i class="fa fa-list"></i> 前台栏目列表</h3>
        </div>
        <div class="panel-body">    
		<div class="navbar navbar-default">
            <div class="row navbar-form">
                <button type="submit" onclick="location.href='{:U('mingteng/System/addEditNav')}'"  class="btn btn-primary pull-left"><i class="fa fa-plus"></i>新增栏目</button>
            </div>
          </div>
                        
          <div id="ajax_return"> 
                 
                    <div class="table-responsive">
                        <table id="list-table" class="table table-bordered table-hover">
                            <thead>
                            <tr>
                                <th class="sorting text-center">栏目ID</th>
                                <th class="sorting text-center">栏目名称</th>
                                <th class="sorting text-center">链接地址</th>                                 
                                <th class="sorting text-center">是否显示</th>
                                <th class="sorting text-center">是否新窗口</th>
                                <th class="sorting text-center">排序</th>                                
                                <th class="sorting text-center">操作</th>                                
                            </tr>
                            </thead>
                            <tbody>
                            <volist name="navigationList" id="list">

                                <tr role="row" align="center" class="{$list.level}" id="{$list.level}_{$list.id}" <if condition="$list[level] gt 1">style="display:none"</if>>
                                <td class="text-center">{$list.id}</td>
                                <td class="text-left" style="padding-left:{$list[level]* 2}em">
                                        <if condition="$list[have_son] eq 1">
                                        <span class="glyphicon glyphicon-plus btn-warning" style="padding:2px; font-size:12px;"  id="icon_{$list.level}_{$list.id}" aria-hidden="false" onclick="rowClicked(this)" ></span>
                                        </if>
                                        {$list.name}
                                    </td>
                                    <td class="text-left">{$list.url}</td>
                                    <td class="text-center">
                                        <img width="20" height="20" src="__PUBLIC__/images/<if condition='$list[is_show] eq 1'>yes.png<else />cancel.png</if>" onclick="changeTableVal('navigation','id','{$list.id}','is_show',this)"/>
                                    </td>
                                    <td class="text-center">
                                        <img width="20" height="20" src="__PUBLIC__/images/<if condition='$list[is_new] eq 1'>yes.png<else />cancel.png</if>" onclick="changeTableVal('navigation','id','{$list.id}','is_new',this)"/>
                                    </td>
                                    <td class="sorting text-center">
                                        <input type="text" onkeyup="this.value=this.value.replace(/[^\d]/g,'')" onpaste="this.value=this.value.replace(/[^\d]/g,'')" onchange="updateSort('navigation','id','{$list.id}','sort',this)"  size="4"  value="{$list.sort}" />
                                    </td>
                                    <td class="text-center">
                                        <a href="{:U('System/addEditNav',array('id'=>$list['id']))}" data-toggle="tooltip" title="" class="btn btn-primary" data-original-title="编辑"><i class="fa fa-pencil"></i></a>
                                        <a href="javascript:del_fun('{:U('System/delNav',array('id'=>$list['id']))}');" id="button-delete6" data-toggle="tooltip" title="" class="btn btn-danger" data-original-title="删除"><i class="fa fa-trash-o"></i></a>
                                    </td>
                                </tr>
                            </volist>
                            </tbody>
                        </table>
                    </div>
                
                <div class="row">
                    <div class="col-sm-6 text-left"></div>
                    <div class="col-sm-6 text-right">{$show}</div>
                </div>
          
          </div>
        </div>
      </div>
    </div>
    <!-- /.row --> 
  </section>
  <!-- /.content --> 
</div>
<script>
    function rowClicked(obj){
    span = obj;

    obj = obj.parentNode.parentNode;

    var tbl = document.getElementById("list-table");

    var lvl = parseInt(obj.className);

    var fnd = false;

    var sub_display = $(span).hasClass('glyphicon-minus') ? 'none' : '' ? 'block' : 'table-row' ;

    if(sub_display == 'none'){
        $(span).removeClass('glyphicon-minus btn-info');
        $(span).addClass('glyphicon-plus btn-warning');
    }else{
        $(span).removeClass('glyphicon-plus btn-info');
        $(span).addClass('glyphicon-minus btn-warning');
    }

    for (i = 0; i < tbl.rows.length; i++){
        var row = tbl.rows[i];

        if (row == obj){
            fnd = true;
        }else{
            if (fnd == true){
                var cur = parseInt(row.className);
                var icon = 'icon_' + row.id;
                if (cur > lvl){
                    row.style.display = sub_display;
                    if (sub_display != 'none'){
                        var iconimg = document.getElementById(icon);
                        $(iconimg).removeClass('glyphicon-plus btn-info');
                        $(iconimg).addClass('glyphicon-minus btn-warning');
                    }else{
                        $(iconimg).removeClass('glyphicon-minus btn-info');
                        $(iconimg).addClass('glyphicon-plus btn-warning');
                    }
                }
                else{
                    fnd = false;
                    break;
                }
            }
        }
    }

    for (i = 0; i < obj.cells[0].childNodes.length; i++){
        var imgObj = obj.cells[0].childNodes[i];
        if (imgObj.tagName == "IMG"){
            if($(imgObj).hasClass('glyphicon-plus btn-info')){
                $(imgObj).removeClass('glyphicon-plus btn-info');
                $(imgObj).addClass('glyphicon-minus btn-warning');
            }else{
                $(imgObj).removeClass('glyphicon-minus btn-warning');
                $(imgObj).addClass('glyphicon-plus btn-info');
            }
        }
    }
}
</script>
</body>
</html>